home *** CD-ROM | disk | FTP | other *** search
/ PC Answers 2003 September / PC Answers September 2003.iso / Software / trial / MonitorIT 5.2.06 / monitorit_fullsetup.exe / data1.cab / Js / Calendar.js < prev    next >
Encoding:
JavaScript  |  2003-06-24  |  17.1 KB  |  510 lines
  1. /* ======================================================================
  2. OBJECT:        com_netobjects_Calendar
  3.  
  4. DESC:            This object creates an interactive calendar.  Developers can specify
  5.                 a selected date and render a calendar for that month.  Developers write 
  6.                 custom functions to populate the calendar with data or respond to user clicks.
  7.                 Users can navigate the calendar and select a specific date.
  8.  
  9. TESTED
  10. PLATFORMS:    Netscape Navigator 4.05 
  11.                 Microsoft Internet Explorer 4.01 
  12. ====================================================================== */
  13. function com_netobjects_Calendar(params) {
  14.  
  15.    // Public Properties    
  16.     this.name                 = (params.name != null) ? params.name : "";
  17.     this.height             = (params.height != null) ? params.height : "";
  18.     this.width              = (params.width != null) ? params.width : "";
  19.  
  20.     this.selDate             = (params.selDate != null) ? params.selDate : "";
  21.     this.wdayFormat         = (params.wdayFormat != null) ? params.wdayFormat : "FirstLetter";
  22.     this.textFont             = (params.textFont != null) ? params.textFont : "Arial";
  23.     this.textSize             = (params.textSize != null) ? params.textSize : "12";
  24.     this.textColor         = (params.textColor != null) ? params.textColor : "";    
  25.     this.selColor             = (params.selColor != null)  ? params.selColor : "";
  26.     this.border             = ((params.border != null) && (params.border != "")) ? params.border : "0";
  27.     this.leftButton        = (params.leftButton != null) ? params.leftButton : "images/leftbutton.gif";
  28.     this.rightButton        = (params.rightButton != null) ? params.rightButton : "images/rightbutton.gif";
  29.     this.invisibleButton        = (params.leftButton != null) ? params.leftButton : "images/invisibleleftbutton.gif";
  30.     this.testMode            = ((params.testMode != null) && (params.testMode != "")) ? params.testMode : "off"
  31.     this.curYear            =    null    // current selected year    
  32.     this.curMonth            =    null    //    current selected month
  33.     this.curDay                =    null    // current selected day
  34.     this.dirMode            =  (params.dirMode != null) ? params.dirMode : false; // direction Mode; default foreward from BaseDate
  35.  
  36.     // Private Properties
  37.     this.childWindow         = null  // Handle to popup window created on open
  38.     this.RenderingDay        = null  // Day currently being rendered - used typically in onRenderDay event
  39.     this.assocDateField    = null  // Associated date field 
  40.  
  41.     // Public Methods
  42.     this.getSelDate         = _Calendar_getSelDate;  // Returns the last selected date as a string in the form mm/dd/yy
  43.     this.render             = _Calendar_render;  // Renders selected month on the spot
  44.     this.open                 = _Calendar_open;  // Renders selected month in new window
  45.  
  46.     // Private Methods
  47.     this.renderMonth        = _Calendar_RenderMonth;
  48.     this.validateProperties= _Calendar_ValidateProperties;
  49.     //  --- date utilities
  50.     this.monthDays         = _Calendar_MonthDays;
  51.     this.getMonths         = _Calendar_GetMonths;
  52.     this.getWDays          = _Calendar_GetWDays;
  53.     this.parseDate         = _Calendar_ParseDate;
  54.     this.dateIncMonth        = _Calendar_DateIncMonth;
  55.  
  56.  
  57.     // Public Events
  58.     this.onSelDate         = _Calendar_onSelDate; // on user selection of date or change of month
  59.     this.onRender             = _Calendar_onRender; // on render of calendar
  60.     this.onRenderDay        = _Calendar_onRenderDay; // on render of each calendar day
  61.     this.onOpen                = _Calendar_onOpen;  // on open of new window & render of calendar
  62.  
  63.     // Private Events (internal event driven functionality)
  64.     this.eonSelDate         = _Calendar_eonSelDate;
  65.  
  66.     // Validate object properties
  67.     this.validateProperties();
  68.  
  69.     // Public Methods ----------------------------------------
  70.  
  71.     /* ======================================================================
  72.     
  73.    METHOD: _Calendar_render.  Renders calendar control.
  74.     
  75.     ====================================================================== */
  76.     function _Calendar_render() {
  77.         // Initialize Variables
  78.         
  79.         var theDate = "";
  80.         if (this.selDate != "")
  81.             theDate = this.parseDate(this.selDate)
  82.         else {
  83.             var today = new Date();
  84.             var todayStr = today.getMonth() + 1;
  85.             todayStr += "/" + today.getDate();
  86.             todayStr += "/" + today.getYear();
  87.             theDate = this.parseDate(todayStr);
  88.         }
  89.             
  90.         if (theDate != null) {
  91.             this.renderMonth(theDate.longYear,theDate.month-1,theDate.day);
  92.         
  93.             // Fire public events
  94.             this.onRender(); 
  95.  
  96.         } else { 
  97.             alert(this.selDate + " is not a valid date")
  98.         }
  99.                 
  100.     
  101.     } // END _Calendar_render
  102.  
  103.  
  104.     /* ======================================================================
  105.     
  106.    METHOD: _Calendar_open.  Pops up a separate window and renders calendar control.
  107.     
  108.     ====================================================================== */
  109.     function _Calendar_open(dfobj) {
  110.         // Initialize Variables
  111.         var sheight = ""
  112.         var swidth = ""
  113.               
  114.         // Set Variables
  115.         if (this.height != "") sheight = ",height=" + this.height
  116.         if (this.width != "") swidth = ",width=" + this.width
  117.  
  118.         // Write HTML
  119.         this.childWindow = document.all[dfobj.calendar]; 
  120.         this.assocDateField = dfobj;
  121.         this.render();
  122.  
  123.         // Fire public events
  124.         this.onOpen();                
  125.     
  126.     } // END _Calendar_open
  127.  
  128.     /* ======================================================================
  129.     
  130.    METHOD: _Calendar_getSelDate.  Pops up a separate window and 
  131.       renders calendar control.
  132.     
  133.     ====================================================================== */
  134.     function _Calendar_getSelDate() {
  135.         return this.selDate;
  136.     } // END _Calendar_getSelDate
  137.  
  138.  
  139.     // Private Methods ----------------------------------------
  140.     
  141.     /* ======================================================================
  142.     
  143.    METHOD: _Calendar_ValidateProperties.  Validate current properties.
  144.     
  145.     ====================================================================== */
  146.     function _Calendar_ValidateProperties() {
  147.     
  148.         if ((this.testMode.toLowerCase() == "text") || (this.testMode.toLowerCase() == "alerts")) {
  149.             var errors = new Array()
  150.           iIndex = 0;  
  151.          
  152.             // Check for errors
  153.             if (this.name == "") 
  154.                 errors[iIndex++] = "Name is a required property.";  
  155.  
  156.             // Display errors
  157.             for (var i=0; i<errors.length; i++)  {
  158.                 if (this.testMode.toLowerCase()    == "text") 
  159.                       document.write( "<BR><HR><B><FONT COLOR=RED>TEST MODE, com_netobjects_Calendar, '" + this.name + "' : </FONT> " + errors[i] + "</B><HR>\n")
  160.                 else
  161.                       alert("TEST MODE, com_netobjects_Calendar, '" + this.name + "' : " + errors[i]);
  162.  
  163.             }            
  164.         } 
  165.     } // END _Calendar_ValidateProperties
  166.  
  167.     /* ======================================================================
  168.     
  169.    METHOD: _Calendar_MonthDays.  Returns days in selected month / year.
  170.     
  171.     ====================================================================== */
  172.     function _Calendar_MonthDays(month, yr) {
  173.     var Days = new Array();
  174.  
  175.         Days[0] = 31;
  176.         Days[1] = 28;
  177.         Days[2] = 31;
  178.         Days[3] = 30;
  179.         Days[4] = 31;
  180.         Days[5] = 30;
  181.         Days[6] = 31;
  182.         Days[7] = 31;
  183.         Days[8] = 30;
  184.         Days[9] = 31;
  185.         Days[10] = 30;
  186.         Days[11] = 31;
  187.     
  188.         // Leap Year Rule: 
  189.         // If the year is evenly divisible by 4 AND NOT by 100, it's a leap year.
  190.         // If the year is evenly divisible by 4 AND 100, it MUST also be divisible by 400
  191.         // to be a leap year.  Otherwise, it is not a leap year.
  192.         var isLeap = false;
  193.         isLeap = ((yr % 400 == 0) || (( yr % 4 == 0) && (yr % 100 != 0)));
  194.  
  195.         if ((month == 1) && (isLeap)) {return Days[month] + 1} else {return Days[month]};
  196.     
  197.     } // END _Calendar_MonthDays
  198.  
  199.     /* ======================================================================
  200.     
  201.    METHOD: _Calendar_GetMonths.  Returns array of month names.
  202.     
  203.     ====================================================================== */
  204.     function _Calendar_GetMonths(){
  205.         this[0] = "January";
  206.         this[1] = "February";
  207.         this[2] = "March";
  208.         this[3] = "April";
  209.         this[4] = "May";
  210.         this[5] = "June";
  211.         this[6] = "July";
  212.         this[7] = "August";
  213.         this[8] = "September";
  214.         this[9] = "October";
  215.         this[10] = "November";
  216.         this[11] = "December";
  217.     } // END _Calendar_GetMonths
  218.     
  219.     /* ======================================================================
  220.     
  221.    METHOD: _Calendar_GetWDays.  Returns array of days in specified format.
  222.     
  223.     ====================================================================== */
  224.     function _Calendar_GetWDays(NoLtrs){
  225.         if (NoLtrs=="FirstLetter") {
  226.             this[0] = "S";
  227.             this[1] = "M";
  228.             this[2] = "T";
  229.             this[3] = "W";
  230.             this[4] = "Th";
  231.             this[5] = "F";
  232.             this[6] = "S";
  233.         } else if (NoLtrs=="FullWord") {    
  234.             this[0] = "Sunday";
  235.             this[1] = "Monday";
  236.             this[2] = "Tuesday";
  237.             this[3] = "Wednesday";
  238.             this[4] = "Thursday";
  239.             this[5] = "Friday";
  240.             this[6] = "Saturday";    
  241.         } else {  // Abbreviated    
  242.             this[0] = "Sun";
  243.             this[1] = "Mon";
  244.             this[2] = "Tues";
  245.             this[3] = "Wed";
  246.             this[4] = "Thurs";
  247.             this[5] = "Fri";
  248.             this[6] = "Sat";
  249.         }
  250.     } // END _Calendar_GetWDays
  251.     
  252.     /* ======================================================================
  253.     
  254.    METHOD: _Calendar_DateIncMonth.  Increments (or Decrements) a date by month increments.
  255.     
  256.     ====================================================================== */
  257.     function _Calendar_DateIncMonth(mm, dd, yy, incMo) {
  258.         var dateObj = new Object();
  259.     
  260.         dateObj.month = mm + incMo;
  261.        dateObj.year = yy, 10;
  262.         dateObj.day = dd;
  263.     
  264.         if (dateObj.month > 11) {
  265.             dateObj.month = 0
  266.             dateObj.year = dateObj.year + 1
  267.         } else if (dateObj.month < 0) {
  268.             dateObj.month = 11
  269.             dateObj.year = dateObj.year - 1
  270.         }
  271.         
  272.         var dayCount = this.monthDays(dateObj.month, dateObj.year); 
  273.         if (dateObj.day > dayCount) dateObj.day = dayCount;
  274.  
  275.         return dateObj
  276.     
  277.     } // END _Calendar_DateIncMonth
  278.     
  279.     /* ======================================================================
  280.     
  281.    METHOD: _Calendar_ParseDate.  Parses a date string in m/d/y or mm/dd/yy 
  282.                 or mm/dd/yyyy format    into it's month, day, year parts. Returns
  283.                  object with properties: month, day, year.
  284.     ====================================================================== */
  285.     function _Calendar_ParseDate(mdyStr) {
  286.         var isValid = true
  287.         var sep1Loc = null
  288.         var sep2Loc = null
  289.     
  290.         //Validate string and get two separator locations
  291.         if (mdyStr == null) 
  292.             isValid = false;
  293.         else {
  294.             /* loop through the string and test each character */
  295.             for (i = 0; i < mdyStr.length; i++) {
  296.                 /* the character must be a number, a forward slash or a dash */
  297.                 if (!((mdyStr.charAt(i) >= '0') && (mdyStr.charAt(i) <= '9') || 
  298.                         (mdyStr.charAt(i) == '/') || (mdyStr.charAt(i) == '-'))) {
  299.                     isValid = false;
  300.                     break;
  301.                 } else if ((mdyStr.charAt(i) == '/') || (mdyStr.charAt(i) == '-')) {
  302.                     if (sep1Loc == null) {
  303.                         sep1Loc = i
  304.                     } else {
  305.                         if (sep2Loc == null) {
  306.                             sep2Loc = i
  307.                         } else {  // Too many separators found!
  308.                             isValid = false;
  309.                             break;
  310.                          }
  311.                 }
  312.                  }
  313.             } // end for loop
  314.         }
  315.     
  316.     // Must have found 2 separators    
  317.     if (sep2Loc == null) {isValid = false}
  318.  
  319.     if (isValid) {
  320.         myObj = new Object();
  321.         myObj.month = mdyStr.substring(0, sep1Loc);
  322.         myObj.day   = mdyStr.substring(sep1Loc + 1, sep2Loc);
  323.         myObj.year  = mdyStr.substring(sep2Loc+1, mdyStr.length); 
  324.         myObj.longYear = parseInt(myObj.year, 10)
  325.         if (!isNaN(myObj.longYear)) {
  326.             if (myObj.longYear < 100) {myObj.longYear = myObj.longYear+1900}
  327.         } else {
  328.             myObj.longYear = 0
  329.         }
  330.  
  331.         return myObj
  332.     } else {
  333.         return null;
  334.     }
  335.     
  336. } // END _Calendar_ParseDate
  337.  
  338.  
  339.     /* ======================================================================
  340.     
  341.    METHOD: _Calendar_RenderMonth.  Renders a selected year month, highlighting 
  342.                 selected day if selDay = 0, does not highlight
  343.     
  344.     ====================================================================== */
  345.     function _Calendar_RenderMonth( selYear, selMonth, selDay) {
  346.  
  347.         var doc = this.childWindow;
  348.         var startDay = (new Date(selYear,selMonth,1)).getDay(); 
  349.         var dayCount = this.monthDays(selMonth, selYear); 
  350.         var calWeeks = Math.ceil((startDay + dayCount)/7)
  351.         var wdays = new this.getWDays(this.wdayFormat);
  352.         var cnt = 1
  353.         // Specify height, if given
  354.         var cellHeight = ""
  355.         if (this.height != "") 
  356.             " height=" + Math.floor(this.height/10);
  357.     
  358.         // Specify text color, if given
  359.         var stextColor = ""
  360.         if (this.textColor != "") stextColor = "link=\"" + this.textColor + "\""
  361.     
  362.         // Specify font face and size, if given
  363.         var sfontTag = ""
  364.         if (this.textFont != "") sfontTag = sfontTag + " Face=\"" +this.textFont + "\""
  365.         //if (this.textSize != "") sfontTag = sfontTag + " Size=\"" +this.textSize +"\""
  366.         if (this.textSize != "") sfontTag = sfontTag + " Style='font-size:9pt'"
  367.  
  368.         if (sfontTag != "") sfontTag = "<Font " + sfontTag + " >"
  369.         
  370.         this.curYear = selYear
  371.         this.curMonth = selMonth
  372.         this.curDay = selDay
  373.         
  374.         doc.innerHTML = ""; // clear the calendar window
  375.        hst = "<table width='100%' Border=\"" + this.border +"\">"
  376.  
  377.         // Check sel day for existance in previous month
  378.         var prevDate = this.dateIncMonth(selMonth,selDay,selYear, -1)
  379.         var nextDate = this.dateIncMonth(selMonth,selDay,selYear, 1)
  380.  
  381.         // Write month - year title
  382.         hst += "<tr><td colspan=7 align=center " + cellHeight + "><b>" + sfontTag
  383.         hst += "<TABLE WIDTH=100%><tr>";
  384.  
  385.         // Write previous month button
  386.         hst += "<td align=left>"
  387.         if ( selYear == baseYear && selMonth == baseMonth && this.dirMode == false ) {  
  388.             hst += '<IMG SRC="' + this.invisibleButton + '" BORDER=0 ALIGN=TOP >'; // no previous Month if current month = BaseMonth
  389.         }
  390.         else {
  391.             hst += '<IMG SRC="' + this.leftButton + '" BORDER=0 ALIGN=TOP onClick="' + this.name + '.eonSelDate(' + prevDate.month + ',' + prevDate.day  + ',' + prevDate.year + ')" ALT="Prev">';
  392.         }
  393.         hst += "</td>";
  394.         
  395.         // Write month - year title
  396.         hst += "<td align=center><b>" + sfontTag;
  397.         hst += (new this.getMonths())[selMonth] + " " + selYear;
  398.         hst += "</b></font></td>"
  399.  
  400.     // Write next month button
  401.         hst += "<td align=right>";
  402.         if ( selYear == baseYear && selMonth == baseMonth && this.dirMode == true ) {  
  403.             hst += '<IMG SRC="' + this.invisibleButton + '" BORDER=0 ALIGN=TOP >'; // no next Month if current month = BaseMonth
  404.         }
  405.         else {
  406.             hst += '<IMG SRC="' + this.rightButton + '" BORDER=0 ALIGN=TOP onClick="' + this.name + '.eonSelDate(' + nextDate.month + ',' + nextDate.day  + ',' + nextDate.year + ')" ALT="Next">';
  407.         }
  408.         hst += '</td>';
  409.         hst += "</tr></TABLE></tr>";
  410.         
  411.         // Write day titles
  412.         hst += "<tr>"
  413.         for (var k = 0; k < 7; k++)  {
  414.             hst += "<td align=center" + cellHeight + "  bgcolor=silver >" + sfontTag    
  415.             hst += wdays[k]
  416.             hst += "</font></td>"
  417.         }
  418.         hst += "</tr>"
  419.     
  420.         // Write days
  421.         for (var i = 0; i < calWeeks; i++)  {
  422.             hst += "<tr>"
  423.             for (var j = 0; j < 7; j++)  {
  424.                 countDay = (((i > 0) || (j >= startDay)) && (cnt <= dayCount))
  425.     
  426.                 if ((selDay != 0) && (selDay == cnt) && (countDay)) {
  427.                     var sSelColor = ""
  428.                     if (this.selColor != "") {sSelColor = " BGCOLOR = \"" +this.selColor + "\""}
  429.                     hst += "<td align=\"center\" " + sSelColor + cellHeight + " >"
  430.                 } else {
  431.                     hst += "<td align=\"center\" valign=top" + cellHeight + " >"
  432.                 }
  433.     
  434.                 if (countDay) { 
  435.                     sfT = sfontTag.substring(0,sfontTag.length-1)
  436.                     hst += sfT
  437.                     if ( selYear == baseYear && selMonth == baseMonth && this.dirMode == false && cnt < baseDay ) {  
  438.                         hst += ' '
  439.                     }
  440.                     else if ( selYear == baseYear && selMonth == baseMonth && this.dirMode == true && cnt > baseDay ) {  
  441.                         hst += ' '
  442.                     }
  443.                     else {
  444.                        hst += ' style="cursor:hand; color:blue; text-decoration:underline"'
  445.                     }
  446.                     hst += ' onClick="' + this.name + '.eonSelDate('  + selMonth + ',' + cnt  + ',' + selYear + ')">'
  447.                     hst += cnt
  448.                     hst += "</Font>"
  449.                     this.RenderingDay = cnt;
  450.                     this.onRenderDay();
  451.                     cnt = cnt + 1;
  452.                 }
  453.                 hst += "</td>"
  454.             }
  455.             hst += "</tr>"
  456.         }
  457.     
  458.         hst += "</tr><td colspan=\"7\" align=center>"
  459.     
  460.         // Check sel day for existance in previous month
  461.         var prevDate = this.dateIncMonth(selMonth,selDay,selYear, -1)
  462.         var nextDate = this.dateIncMonth(selMonth,selDay,selYear, 1)
  463.     
  464.         hst += "</td></tr>"
  465.         hst += "</table>"
  466.         doc.insertAdjacentHTML("beforeEnd",hst); // output the calendar
  467.     } // END _Calendar_RenderMonth
  468.     
  469.     // Private Event Handlers ----------------------------------------
  470.     
  471.     /* ======================================================================
  472.     
  473.    EVENT: _Calendar_eonSelDate.  Internal event handler.  Sets selDate and 
  474.             re-renders control.
  475.     
  476.     ====================================================================== */
  477.     function _Calendar_eonSelDate(selMonth, selDay, selYear) {
  478.         //    Set the selected date
  479.         sMon = (selMonth+1);
  480.         //sMon = (sMon < 10) ? "0"+sMon : ""+sMon;
  481.         sDay = (selDay < 10) ? "0"+selDay : ""+selDay;
  482.  
  483.         this.selDate = sMon + "/" +  sDay + "/" +  selYear
  484.         
  485.         // Render the month
  486.         if ( this.onSelDate(selMonth, selDay, selYear, this.assocDateField, this.dirMode) ) {
  487.             if ( selMonth == curSelMonth && selYear == curSelYear) {
  488.                 selDay = curDay;
  489.             }
  490.             else {
  491.                 selDay = 0;
  492.             }
  493.               this.renderMonth(selYear,selMonth,selDay);
  494.             // Fire public events
  495.             this.onRender(); 
  496.         }
  497.     } // END _Calendar_eonSelDate
  498.     
  499.     
  500.     // Public Event Handlers ----------------------------------------
  501.     function _Calendar_onRender() {
  502.     }
  503.     function _Calendar_onRenderDay() {
  504.     }  
  505.     function _Calendar_onSelDate() {
  506.     }  
  507.     function _Calendar_onOpen() {
  508.     }  
  509.  
  510. } // END CONSTRUCTOR com_netobjects_Calendar